@charset "utf-8";
*{
    margin: 0;
    padding: 0;
    list-style: none;
    font-family: "微软雅黑";
    font-size: 14px;
    text-decoration: none;
}
.clear{
    clear: both;
}
.cultureWeb{
    min-width: 1200px;
    width: 100%;
    background: #f6f7fb;
    .topbg{
        width: 100%;
        height: 690px;
        background: url(../img/culture/Culturalgrandviewgarden.jpg); 
        .login{
            width: 1200px;
            height: 32px;
            margin: 0 auto;
            div{
                float: right;
                span{
                    color: #686370;
                line-height: 32px;
                }
                a{
                color: #d6d4db;
                line-height: 32px;
                }
                img{
                vertical-align: middle;
                width: 16px;
                padding-right: 5px;
                }
            }
        }
        .navigationbg{
            width: 100%;
            height: 100px;
            background: #d3d4e3;
            .navigation{
                width: 1200px;
                margin: 0 auto;
                .navCulture{
                    width: 200px;
                    float: left;
                }
                .navCulture h3{
                font-size: 26px;
                color: #cf1132;
                line-height: 100px;
                }
                .navigation_content{
                    width: 100px;
                    height: 110px;
                    float: left;
                    line-height: 100px;
                    text-align: center;
                    font-size: 16px;
                    color: #777777;
                    cursor:pointer;
                    transition-property:height ;
                    -moz-transition-property:height ;
                    -webkit-transition-property:height ;
                    transition-duration: .5s;
                    -moz-transition-duration: .5s;
                    -webkit-transition-duration: .5s;
                }
                .navigation_content:hover {
                    height: 110px;
                    background:#cf1132;
                    color: white;
                }
                .teacher{
                    float: right;
                    color: #888;
                    line-height: 100px;
                }
                .teacher img{
                    vertical-align: middle;
                }
                .Lembo{
                    margin: 30px auto;
                }
                .Lembo img{
                    width: 100%;
                }
            }
        }
    }
    .flowerCity{
        width: 1200px;
        height: 372px;
        margin: 0 auto;
        margin-top: 13px;
        .redside{
            width: 4px;
            height: 20px;
            float: left;
            background: #cf1132;
            margin-top: 17px;
            margin-left: 1px;
            margin-right: 10px;
        }
        .flowerCity_top{
            font-size: 20px;
            width: 100px;
            height: 54px;
            line-height: 54px;
            float: left;
        }
        ul li{
        line-height:54px ;
        float: left;
        padding-left: 16px;
        }
        .more{
            float: right;
            height: 54px;
            line-height: 54px;
            color: #888888;
        }
        .movie{
            width: 1200px;
            .rxjb{
                width:477px ;
                position: relative;
                float: left;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 477px;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom:0;
                    background:rgba(0,0,0,.5);
                    line-height: 1.5;
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
            .tdby{
                width: 231px;
                position: relative;
                float: left;
                margin-left: 10px;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
            .lmjz{
                width: 231px;
                position: relative;
                float: left;
                margin-left: 10px;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
                        .gzyq{
                width: 231px;
                position: relative;
                float: left;
                margin-left: 10px;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
            .ydzs{
                width: 231px;
                position: relative;
                float: left;
                margin-left: 10px;
                margin-top: 10px;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
            .wpdwp{
                width: 231px;
                position: relative;
                float: left;
                margin-left: 10px;
                margin-top: 10px;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
            .zqdn{
                width: 231px;
                position: relative;
                float: left;
                margin-left: 10px;
                margin-top: 10px;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
        } 
    }
    .mvMusic{
        width: 1200px;
        height: 425px;
        margin: 0 auto;
        .mv{
            width: 718px;
            height: 56px;
            float: left;
            margin-top: 20px;
            position: relative;
            .redside{
                width: 4px;
                height: 20px;
                float: left;
                background: #cf1132;
                margin-left: 1px;
                margin-right: 10px;
                margin-top: 18px;
            }
            .leftMusic{
                float: left;
                .ba{
                width: 231px;
                position: relative;
                    img{
                    width: 100%;
                    display: block;
                    }
                    div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                        }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                        }
                    }
                }
                .twj{
                width: 231px;
                position: relative;
                margin-top: 10px;
                    img{
                    width: 100%;
                    display: block;
                    }
                    div{
                    width: 100%;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    background:rgba(0,0,0,.5);
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                        }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                        }
                    }
                }
            }
            .recommendMV{
                float: left;
                font-size: 20px;
                height: 56px;
                line-height: 56px;
            }
            .more{
                float: right;
                height: 54px;
                line-height: 54px;
                color: #888888;
            }
            .pyghlkn{
                width:477px ;
                position: relative;
                float: left;
                margin-left: 10px;
                img{
                    width: 100%;
                    display: block;
                }
                div{
                    width: 477px;
                    height: 52px;
                    position: absolute;
                    left: 0;
                    bottom:0;
                    background:rgba(0,0,0,.5);
                    line-height: 1.5;
                    .font1{
                        color: white;
                        padding-top: 5px;
                        padding-left: 10px;
                    }
                    .font2{
                        color: #bbb;
                        padding-left: 10px;
                    }
                }
            }
        }
        .Music{
            float: right;
            height: 56px;
            width: 452px;
            margin-top: 20px;
            .redside{
                width: 4px;
                height: 20px;
                float: left;
                background: #cf1132;
                margin-left: 1px;
                margin-right: 10px;
                margin-top: 18px;
            }
            .hotMusic{
                float: left;
                font-size: 20px;
                height: 56px;
                line-height: 56px;
                width: 78px;
            }
            .area{
                float: left;
                ul li{
                    float: left;
                    margin-top: 18px;
                    padding-left: 17px;
                }
                ul li:first-child{
                    color: #cf1132;
                }
            }
            .more{
                float: right;
                height: 54px;
                line-height: 54px;
                color: #888888;
            }
            .hotsongList{
                background: white;
                width: 450px;
                height: 317px;
                border-radius: 1px solid #ddd;
                ul li div{
                    line-height: 17px;
                    text-align: center;
                    width: 13px;
                    height: 17px;
                    border: solid 1px #ddd;
                    border-radius: 3px;
                    font-size: 12px;
                    float: left;
                    margin-right: 20px;
                }
                ul li{
                    padding-top: 12px;
                    padding-left: 11px;
                    img{
                        vertical-align: middle;
                        float: right;
                        margin-right:10px ;
                    }
                    img:hover{
                        background-image: url(../img/culture/play2.png);
                    }
                    .love:hover{
                        background-image:url(../img/culture/love2.png) 
                        ;
                    }
                }
                ul li:first-child div{
                    background: #ff1200;
                    border: none;
                    width: 14px;
                    height: 18px;
                    color: white;
                    line-height: 18px;
                }
                ul li:nth-child(2) div{
                    border: none;
                    width: 14px;
                    height: 18px;
                    color: white;
                    background: #ff4e00;
                    line-height: 18px;
                }
                ul li:nth-child(3) div{
                    border: none;
                    width: 14px;
                    height: 18px;
                    color: white;
                    background: #ff9000;
                    line-height: 18px;
                }
            }
        }
    }
    .enjoyPhotos{
        width: 100%;
        img{
            width: 100%;
            display: block;
        }
    }
    .novel{
        width: 1200px;
        margin: 10px auto 0;
        .qualityBooks{
            float: left;
            width: 920px;
        }
        .qualityBooks .qualityBooks_top{
             .redside{
                width: 4px;
                height: 20px;
                float: left;
                background: #cf1132;
                margin-left: 1px;
                margin-right: 10px;
                margin-top: 18px;
            }
            .qualityBooks_top_tittle{
                float: left;
                font-size: 20px;
                height: 56px;
                line-height: 56px;
                width: 100px;
            }
            ul li{
                float: left;
                padding-left: 16px;
                margin-top: 18px;
            }
            ul{
                width: 505px;
            }
            .books{
                width: 918px;
                height: 530px;
                border: solid 1px #ebe8e5;
                background: white;
                float: left;
                ul{
                    width:918px ;
                }
                ul li{
                    float: left;
                    padding-left: 36px;
                    width: 114px;
                    height: 256px;
                    line-height: 1.5;
                    .font3{
                        font-size: 16px;
                        font-weight: bold;
                    }
                    .font4{
                        font-size: 11px;
                        color: #888;
                    }
                }
                ul li:first-child{
                    padding-left: 27px;
                }
                ul li:nth-child(7){
                    padding-left: 27px;
                }
            }
        }
            .Ranking{
                float: right;
            
                .ranking_strong{
                    float: left;
                    font-size: 20px;
                    height: 56px;
                    line-height: 56px;
                    width: 100px;
                }
                .redside{
                    width: 4px;
                    height: 20px;
                    float: left;
                    background: #cf1132;
                    margin-left: 1px;
                    margin-right: 10px;
                    margin-top: 18px;
            }
            .gt{
                background: white;
                width: 258px;
                height: 142px;
                border: 1px solid #ebe8e5;
                padding-top:19px ;
                div{
                    float: left;
                }
                div:first-child{
                    color: #e74c3c;
                    font-size: 15px;
                    padding-left: 17px;
                }
                div:nth-child(2){
                    padding-left: 17px;
                }
                div:nth-child(3){
                    padding-left: 17px;
                    p:first-child{
                        font-size: 15px;
                    }
                    p:nth-child(2){
                        font-size: 12px;
                        color: #888;
                    }
                }   
            }
            .jsgj{
                background: white;
                border: 1px solid #ebe8e5;
                border-top: none;
                width: 258px;
                height: 40px;
                div{
                    float: left;
                    text-align: center;
                    line-height: 40px;
                }
                div:first-child{
                    color: #aaa;
                    font-size: 15px;
                    padding-left: 17px;
                }
                div:nth-child(2){
                    padding-left: 17px;
                    color: #666;
                }
            }   
        }
    } 
    .yhj{
        width: 100%;
        margin: 0 auto;
        margin-top: 20px;
        img{
            width: 100%;
        }
    }
    .game{
        width: 1200px;
        margin: 0 auto;
        .hotGame{
            float: left;
            width: 910px;
            .redside{
                width: 4px;
                height: 20px;
                float: left;
                background: #cf1132;
                margin-left: 1px;
                margin-right: 10px;
                margin-top: 18px;
            }
            .hotGame_top{
                font-size: 20px;
                float: left;
                height: 56px;
                line-height: 56px;
                width: 120px;
            }
            .zmqsy{
                width: 290px;
                height: 318px;
                line-height: 1.5;
                float: left;
                margin-right: 10px;
                margin-bottom: 10px;
                background: white;
                .font3{
                    font-size: 16px;
                    font-weight: bold;
                    padding-left: 20px;
                    padding-right: 20px;
                }
                .font4{
                    font-size: 11px;
                    color: #888;
                    padding-left: 20px;
                    padding-right: 20px;
                }
                hr{
                    color: #888;
                    width: 250px;
                    margin: 5px auto 5px;
                }
                span{
                    font-size: 11px;
                    color: #888;
                    float: right;
                    padding-right: 15px;
                }
            }
        }
        .newGame{
            float: left;
            margin-left: 15px;
            .redside{
                width: 4px;
                height: 20px;
                float: left;
                background: #cf1132;
                margin-left: 1px;
                margin-right: 10px;
                margin-top: 18px;
            }
            .newGame_top{
                font-size: 20px;
                float: left;
                height: 56px;
                line-height: 56px;
                width: 120px;
            }
            
            .wzry{
                width: 258px;
                height: 106px;
                border: 1px solid #ebe8e5;
                background: white;
                border-top: none;
                div{
                    float: left;
                    line-height: 1.5;
                    .font3{
                        font-size: 16px;
                        font-weight: bold;
                        padding-left: 20px;
                        padding-right: 20px;
                        padding-top: 35px;
                    }
                    .font4{
                        font-size: 11px;
                        color: #888;
                        padding-left: 20px;
                        padding-right: 20px;
                    }
                    img{
                        padding-top: 20px;
                        padding-left: 17px;
                    }
                }
                .font8{
                    font-size: 30px;
                    color: #888;
                    padding-top: 32px;
                }
            }
            .wzry:first-child{
                border-top:1px solid #ebe8e5 ;
            }
        }   
    }
    .content_games{
        width: 100%;
        background: #f6f7fb;
        position: absolute;
        left: 0;
        top:132px ;
        .gameNav{
            height: 66px;
            width: 1200px;
            background: white;
            margin: 33px auto 0;
            vertical-align: middle;
            ul li{
                float: left;
                width: 66px;
                text-align: center;
                line-height: 66px;
            }
            ul li:first-child{
                width: 100px;
                margin-left: 20px;
            }
            ul li:hover{
                background: #cf1132;
                color: white;
            }
        }
        .page{
            width: 1200px;
            height: 100px;
            margin: 0 auto;
            ul li{
                float: left;
                width: 46px;
                height: 46px;
                margin-top: 30px;
                line-height: 46px;
                text-align: center;
            }
            ul li:first-child{
                margin-left: 238px;
            }
            ul li:hover{
                background: #cf1132;
                color: white;
            }
        }
    }
}



